/*
 * @Description:
 * @Autor: tanpeng
 * @Date: 2021-07-30 09:41:23
 * @LastEditors: tanpeng
 * @LastEditTime: 2021-09-08 10:28:12
 */
import store from './store'
import { registerMicroApps, initGlobalState } from 'qiankun'
// 初始化 参数 state，state一定要起名初始化，这里我监听的是closeTab
const actions = initGlobalState({ closeMicoLoading: false })
actions.onGlobalStateChange((state, prev) => {
  // state: 变更后的状态; prev 变更前的状态
  console.log('main state change', state.closeMicoLoading, prev)
  // 将action对象绑到Vue原型上，为了项目中其他地方使用方便
  // Vue.prototype.$actions = actions;
  // this.$actions.setGlobalState({
  //   mt: value
  // });
  if (state.closeMicoLoading) {
    console.log("store", store);
    // vuex里面的modules里面的mutation，已经被全局使用，不想全局可以给命名空间，另外，直接调用mutation不太好，最好使用action，也就是dispatch方式
    store.dispatch("micoapp/closeMicoLoading", state.closeMicoLoading);
  }
})

/**
 * 路由监听
 * @param {*} routerPrefix 前缀
 */
function genActiveRule(routerPrefix, currentRoute = '') {
  return location => location.pathname.startsWith(routerPrefix)
}
// 主应用共享出去的数据
const msg = {
  state: store.state,
  isQiankun: true,
  token: store.state.bms.token,
  system: process.env.VUE_APP_SYSTEM
}
// 注册子应用
registerMicroApps(
  [
    {
      name: 'less-code-front',
      entry: process.env.VUE_APP_MICO_LESS_CODE_SERVICE,
      container: '#micoContainer', // 子应用所在容器
      activeRule: genActiveRule('/lessCodeService'),
      props: msg,
      sandbox: {
        strictStyleIsolation: true
      }
    }
  ],
  {
    beforeLoad: [
      app => {
        console.log('before load', app)
      }
    ], // 挂载前回调
    beforeMount: [
      app => {
        console.log('before mount', app)
      }
    ], // 挂载后回调
    afterUnmount: [
      app => {
        console.log('after unload', app)
      }
    ] // 卸载后回调
  }
)
